<template>
	<view>
		<cu-custom :bgColor="NavBarColor" :isBack="isShow!=1" backRouterName="index">
			<block slot="backText" v-if="isShow!=1">返回</block>
			<block slot="content">会员中心</block>
		</cu-custom>
		<scroll-view scroll-y class="page">
			  <!-- 头部logo-->
		  <view class="UCenter-bg" style="background-color: #ff3333;">
		    <image :src="user.avatar" class="png round animation-slide-right margin-bottom-sm" mode="scaleToFill" :style="[{animationDelay: '0.1s'}]"></image>
		  			<view class="flex flex-sub flex-direction solid-right animation-slide-top" :style="[{animationDelay: '0.2s'}]">
		  			  <view class="text-xl text-orange" style="color: #fff;">姓名:{{user.name}}&nbsp;&nbsp;&nbsp;&nbsp;ID:{{user.userId}}</view> 
		  			</view>
		  			<view class="flex flex-sub flex-direction animation-slide-top" :style="[{animationDelay: '0.2s'}]">
					   <view class="text-xl text-green" style="color: #fff;"><text v-if="user.vipDJ==2">等级:会员&nbsp;&nbsp;&nbsp;&nbsp;推荐人:{{user.tuijianren}}</text><text v-else>等级:非会员&nbsp;&nbsp;&nbsp;&nbsp;推荐人:{{user.tuijianren}}</text> 
					   </view>
		  			</view> 
		  </view>
		  		 
			 
				 
				 
		  <view class="padding flex text-center text-grey bg-white shadow-warp">
		    <view class="flex flex-sub flex-direction solid-right animation-slide-top" 	@tap="goPage()">
		      <view class="text-xl lines-black">{{user.dds}}</view>
			  <view class="margin-top-sm">订单数</view>
		    </view>
		   <view class="flex flex-sub flex-direction solid-right animation-slide-top"  @tap="goPage()">
		     <view class="text-xl lines-black">{{user.dsh}}</view>
		     <view class="margin-top-sm">待审核</view>
		   </view>
		   <view class="flex flex-sub flex-direction solid-right animation-slide-top" @tap="goPage()">
		     <view class="text-xl lines-black">{{user.ysh}}</view>
		     <view class="margin-top-sm">已审核</view>
		   </view>
			<view class="flex flex-sub flex-direction solid-right animation-slide-top" :style="[{animationDelay: '0.2s'}]">
			  <view class="text-xl lines-black">{{user.hongbao}}元</view>
			  <view class="margin-top-sm">红包收入</view>
			</view>
				      		   
		
		   		   
		  </view>
		  <!-- 列表list-->
		  <view class="cu-list menu card-menu margin-top-xl margin-bottom-xl shadow-lg radius">
			<navigator class="cu-item arrow " url="/pages/share/index" :style="[{animationDelay: '0.6s'}]">
			     <view class="content">
				    <text class="cuIcon-share text-cyan"></text>
					<text class="text-grey">邀请好友</text>
			    </view>
			</navigator>
		    <navigator class="cu-item arrow " url="/pages/user/userdetail" :style="[{animationDelay: '0.6s'}]">
		      <view class="content">
		 	    <text class="cuIcon-friend text-cyan"></text>
		 		<text class="text-grey">个人资料</text>
		     </view>
		 </navigator>
			<navigator class="cu-item arrow " url="/pages/user/pwdedit" :style="[{animationDelay: '0.6s'}]">
			     <view class="content">
				    <text class="cuIcon-profile text-cyan"></text>
					<text class="text-grey">修改密码</text>
			    </view>
			</navigator>
			<navigator class="cu-item arrow " url="/pages/about/about" :style="[{animationDelay: '0.6s'}]">
			     <view class="content">
				    <text class="cuIcon-infofill text-cyan"></text>
					<text class="text-grey">关于我们</text>
			    </view>
			</navigator> 
			<navigator class="cu-item arrow " :style="[{animationDelay: '0.7s'}]" url="/pages/user/userexit" hover-class="none">
				<view class="content" >
				    <text class="cuIcon-exit text-cyan"></text>
					<text class="text-grey">退出</text>
				</view>
			</navigator>
		  </view>
		  <view class="cu-tabbar-height"></view>
		</scroll-view>
	</view>
</template>

<script>
	import api from '@/api/api'
	export default {
		name: "people",
		props: {
		    isShow: {
		      type: Boolean,
		      default: false
		    }
		  },
		data() {
			return {
				personalList:{
				  avatar:'',
				  realname:'',
				  username:'',
				  post:''
				},
				user:{},
				  positionUrl:'/sys/position/list',
				  departUrl:'/sys/user/userDepartList',
				  userUrl:'/sys/user/queryById',
				  postUrl:'/sys/position/queryByCode',
				  userId:'',
				  id:''
			};
		},
		watch: {
			cur: {
				immediate: true,
				handler() {
					console.log('watch',this.cur)
				    this.userId=this.$store.getters.userid;
					this.load()
				},
			},
		},
		mounted() {
			this.usertongji()
		},
		methods: {
			usertongji(page){
				api.usertongji( this.userId).then(response => {
						      if(response.data.code ==200){   
								  this.user = response.data.result  
								  let avatar=(response.data.result.avatar && response.data.result.avatar.length > 0)? api.getFileAccessHttpUrl(response.data.result.avatar):'/static/avatar_boy.png'
								  this.user.avatar =avatar
						      }else{ 
								let msg = response.data.message || "请求超时"
								this.$tip.alert(msg);  
						      }
				  }).catch(error => { 
					this.$tip.alert("请求超时");
					
					this.isDisabled = true 
				})
			},
			goPage(page){ 
				this.$Router.push({name: 'order'})
			},
			scan(){
				 console.log("进来了")
				// #ifndef H5
				uni.scanCode({
				    success: function (res) {
						console.log('条码res：' + res);
				        console.log('条码类型：' + res.scanType);
				        console.log('条码内容：' + res.result);
				    }
				});
				// #endif
				// #ifdef H5
				this.$tip.alert("暂不支持")
				// #endif
			},
			load(){
				if(!this.userId){
					
					return;
				}
				this.$http.get(this.userUrl,{params:{id:this.userId}}).then(res=>{
					console.log("res",res)
					 if (res.data.success) {
						let perArr = res.data.result
				        let avatar=(perArr.avatar && perArr.avatar.length > 0)? api.getFileAccessHttpUrl(perArr.avatar):'/static/avatar_boy.png'
						this.personalList.avatar =avatar
						this.personalList.realname = perArr.realname
						this.personalList.username = perArr.username
						this.personalList.depart = perArr.departIds
					    this.getpost(perArr.post)
					}
				}).catch(err => {
					console.log(err);
				});
				
			},
			getpost(code){
				if(!code||code.length==0){
					this.personalList.post='员工'
					return false;
				}
				this.$http.get(this.postUrl,{params:{code:code}}).then(res=>{
					console.log("postUrl",res)
					 if (res.data.success) {
						this.personalList.post=res.data.result.name
					}
				}).catch(err => {
					console.log(err);
				});
				
			}
		}
	}
</script>

<style>
.UCenter-bg {
	/* #ifdef MP-WEIXIN */
	/* background-image: url('https://static.jeecg.com/upload/test/blue_1595818030310.png'); */
	/* #endif */
	/* #ifndef MP-WEIXIN */
	/* background-image: url('/static/blue.png'); */
	/* #endif */
  background-size: cover;
  height: 400rpx;
  display: flex;
  justify-content: center;
  padding-top: 40rpx;
  overflow: hidden;
  position: relative;
  flex-direction: column;
  align-items: center;
  color: #fff;
  font-weight: 300;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
}

.UCenter-bg text {
  opacity: 0.8;
}

.UCenter-bg image {
  width: 200rpx;
  height: 200rpx;
}

.UCenter-bg .gif-wave{
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
  z-index: 99;
  mix-blend-mode: screen;  
  height: 100rpx;   
}

map,.mapBox{
  left: 0;
  z-index: 99;
  mix-blend-mode: screen;  
  height: 100rpx;   
}

map,.mapBox{
  width: 750rpx;
  height: 300rpx;
}
</style>
